<template>
	<view class="page">
		<view class="logo-wrap">
			<image class="logo" src="https://yun.shlxkj.info:44300/艾瑞测/小程序/static/img/big-logo.png" mode="aspectFit" />
		</view>
		<view class="content">
			<view class="title">艾瑞测</view>
			<view class="title second">尿液电子检测</view>
			<view class="explain-wrap">
				<view class="explain">本应用程序需要与尿液电子检测盒配合使用。</view>
				<view class="explain">请确保手机的蓝牙为开启状态，如果您的蓝牙未开启请按照提示开启蓝牙。
				</view>
			</view>
		</view>
		<div class="enter-container">
			<view class="enter-wrap" @click="goLogin">开始检测</view>
		<!-- 	<view class="scan" @click="onScan">
				<image class="scan-img" src="https://yun.shlxkj.info:44300/艾瑞测/小程序/static/img/scan.png" mode="aspectFit" />
				<text class="scan-text">扫码领取电子检测盒</text>
			</view>
			<view class="download" @click="skip">
				<text class="load-text">点击下载APP</text>
			</view> -->
		</div>
		<copyright />
	</view>
</template>

<script>
	import Copyright from '@/components/copyright/index.vue'
	import {
		ConvertCoordinate,
		Shipment,
		Base64_theone,
		login
	} from '@/utils/api.js'
	export default {
		name: 'Welcome',
		components: {
			Copyright
		},
		data() {
			return {
				gps: false
			}
		},
		onLoad(op) {
			// this.getLocation()
		},
		methods: {
			getLocation(tag) {
				uni.getLocation({
					type: 'wgs84',
					success: async (res) => {
						//res.longitude,res.latitude分别为当前经度，纬度
						const response = await ConvertCoordinate({
							Locations: [res.longitude, res.latitude].join(',')
						})
						console.log(response.Data.regeocode)
						if (response.Code === 200) {
							const {
								province,
								city,
								district
							} = response.Data.regeocode.addressComponent
							const address = response.Data.regeocode.formatted_address
							this.$store.commit('$uStore', {
								name: 'vx_city',
								value: {
									province,
									city,
									district,
									address
								}
							})
							this.gps = true
							if (tag) {
								uni.navigateTo({
									url: '/pages/login/index'
								})
							}
						}
					},
					fail: (err) => {
						console.log(err)
						this.gps = false
						uni.showModal({
							title: '提示',
							content: '使用本设备时，请开启手机定位！',
							showCancel: false,
							success: (res) => {
								if (res.confirm) {
									console.log('用户点击确定');
								}
							}
						});
					}
				});
			},
			goLogin() {
				// if (this.gps) {
				const token = this.$store.state.vx_u_info.token
				console.log('当前token',token);
				if (token) {
					uni.reLaunch({
						url: '/pages/home/index'
					})
				} else {
					uni.navigateTo({
						url: '/pages/login/index'
					})
				}
				// } else {
				//   this.getLocation(true)
				// }
			},
			onScan() {
				console.log(this.$store.state);
				const token = this.$store.state.vx_token
				console.log(token)
				if (token) {
					uni.scanCode({
						success: async (res) => {
							console.log(res)
							let base64 = res.result
							let data = {
								content: base64
							}
							const response = await Base64_theone(data)
							console.log(response);
							if (response.Data.includes("上海量欣科技有限公司-静安VCT门诊")) {
								let address = response.Data.split('-')[1]
								console.log(address);
								uni.navigateTo({
									url: `/pages/receive/index?address=${address}`
								})
							} else {
								uni.showModal({
									title: '提示',
									content: '请扫描正确的二维码',
									success: (res) => {
										if (res.confirm) {
											this.onScan()
										} else if (res.cancel) {
											console.log('用户点击取消');
										}
									}
								})
							}
						}
					})
				} else {
					uni.showModal({
						title: '提示',
						content: '请先登录！',
						showCancel: false,
						success: (res) => {
							if (res.confirm) {
								uni.navigateTo({
									url: '/pages/login/index?scan=1'
								})
							}
						}
					})

				}
			},
			skip() {
				uni.navigateTo({
					url: '/pages/download/index'
				})
			}

		}
	}
</script>

<style lang="scss" scoped>
	.page {
		width: 100vw;
		height: 100vh;
		background: #F5F7FB;

		.logo-wrap {
			width: 611.54rpx;
			height: 286.54rpx;
			padding-top: 444rpx;
			margin: 0 auto;

			.logo {
				width: 611.54rpx;
				height: 286.54rpx;
			}
		}

		.content {
			padding-top: 125rpx;

			.title {
				text-align: center;
				display: block;
				height: 46rpx;
				font-size: 46rpx;
				line-height: 46rpx;
				color: #333333;
				margin: auto;

				&.second {
					margin-top: 20rpx;
				}
			}

			.tips {
				margin-top: 38rpx;
				line-height: 46rpx;
				font-size: 36rpx;
				font-weight: bolder;
				color: #343A40;
				text-align: center;
			}

			.explain-wrap {
				margin: 40rpx 60rpx 0;
			}

			.explain {
				font-size: 27rpx;
				font-weight: 400;
				color: #333333;
				line-height: 40rpx;
				text-align: center;
			}
		}

		.enter-container {
			position: absolute;
			bottom: 239rpx;
			left: 0;
			right: 0;
			margin: 0 auto;
			display: flex;
			flex-direction: column;
			align-items: center;
		}

		.enter-wrap {
			width: 465rpx;
			height: 85rpx;
			margin-top: 60rpx;
			line-height: 85rpx;
			text-align: center;
			font-weight: 400;
			color: #FFFFFF;
			font-size: 31rpx;
			background: #1E64E1;
			border-radius: 15rpx;
		}

		.scan {
			margin-top: 32rpx;
			display: flex;
			align-items: center;
			justify-content: center;

			.scan-img {
				width: 31rpx;
				height: 31rpx;
			}

			.scan-text {
				height: 23rpx;
				line-height: 23rpx;
				font-size: 23rpx;
				font-weight: 400;
				margin-left: 4rpx;
				color: #1E64E1;
			}
		}

		.download {
			.load-text {
				height: 23rpx;
				line-height: 23rpx;
				font-size: 23rpx;
				font-weight: 400;
				// margin-left: 4rpx;
				color: #1E64E1;
			}
		}
	}

	@media only screen and (min-device-width: 375px) and (max-device-width: 736px) {
		.page {
			.logo-wrap {
				padding-top: 244rpx;
			}
		}
	}

	@media only screen and (max-device-width: 375px) {
		.page {
			.logo-wrap {
				padding-top: 200rpx;
			}
		}
	}
</style>